// 点击id为startButton的按钮时，当type不等于1时，将type设置为1，并执行getLotteryData和getData方法；当type等于1时，需要调用stop方法
document.getElementById('startButton').addEventListener('click', function () {
    if (type !== 1) {
        type = 1;
        getLotteryData();
        getData();
    } else {
        stop();
    }
});

// 定义一个方法getData,通过jquery的ajax调用get请求的http://127.0.0.1:5001/numbers/接口，拿到的返回数据data.numbers后调用start方法（start：数字滚动）
function getData() {
    $.ajax({
        url: 'http://127.0.0.1:5001/numbers/',
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            start(data.numbers);
        }
    });
}

// 定义一个方法getLotteryDat，通过jquery的ajax调用get请求的http://127.0.0.1:5001/lottery/接口，拿到的返回数据data.number需要保存到全局变量curNum
function getLotteryData() {
    $.ajax({
        url: 'http://127.0.0.1:5001/lottery/',
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            curNum = data.number;
        }
    });
}

//  定义一个方法start，可以从传入的形参list中，每隔100ms从list中随机抽取一个元素，方法内部定义一个全局的index定时器，并挂载到window中。list是一个单层数组，每个元素是一个字符串，并将其居中展示到id为prizeBox的元素框中，文字必须要居中
function start(list) {
    let index = setInterval(() => {
        let num = Math.floor(Math.random() * list.length);
        $('#prizeBox').text(list[num]);
    }, 100);
    window.index = index;
    // 将id为startButton的按钮文字改为“停止抽奖”
    document.getElementById('startButton').innerText = '停止抽奖';
    // 将id为prizeBox的文字设置为居中
    $('#prizeBox').css('text-align', 'center');
}

// 定义一个stop方法,调用时,将type变量值设置为2,并将全局的index定时器销毁,然后将curNum显示到id为prizeBox的元素中，文本居中
function stop() {
    type = 2;
    clearInterval(window.index);
    $('#prizeBox').text(curNum);
    document.getElementById('startButton').innerText = '开始抽奖';
    $('#prizeBox').css('text-align', 'center');
}